<template>
  <el-input ref='searchInput'
            v-model="NameOrStudentAccount"
            autocapitalize="off"
            autocomplete="off"
            autocorrect="off"
            autofocus
            clearable
            icon="Search"
            placeholder="搜索..."
            spellcheck="false"
            style="width: 30%;"
            type="text"
            @change="getAllFieldwork"
  />
  <el-button
      icon="search"
      style="position: relative; left: 5px"
      type="primary"
      @click="getAllFieldwork"
  >搜索
  </el-button>
  <el-button type="primary" @click="exportToExcel">导出Excel</el-button>
  <el-table
      :data="FieldworkForm"
      border style="width: 100%"
      :header-cell-style="{'text-align':'center'}"
      :cell-style="{'text-align':'center'}"
      height="80vh"
      v-model="selectedRow"
      @selection-change="handleSelectionChange">
    <el-table-column
        type="selection"
        width="55">
    </el-table-column>
    <el-table-column prop="accountNo" label="学号" width="210" sortable></el-table-column>
    <el-table-column prop="name" label="姓名" width="150" sortable></el-table-column>
    <el-table-column prop="unitName" label="实习单位名称" width="300" sortable></el-table-column>
    <el-table-column prop="unitPosition" label="职位名称" width="150" sortable></el-table-column>
    <el-table-column prop="unitDuty" label="主要职责" width="150" sortable></el-table-column>
    <el-table-column prop="startTime" label="开始时间" width="200" sortable></el-table-column>
    <el-table-column prop="endTime" label="结束时间" width="200" sortable></el-table-column>
    <el-table-column prop="remark" label="备注" width="300" sortable></el-table-column>
    <el-table-column  label="操作" width="100"></el-table-column>
  </el-table>

  <el-pagination
      class="pagination"
      :page-size="pageSize"
      small
      :pager-count="5"
      :page-sizes="[50, 100 , 200 , 500,1000,2000,5000]"
      :total="total"
      layout="total, sizes, prev, pager, next"
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange">
  </el-pagination>
</template>

<script>
import * as XLSX from "xlsx";
import request from "@/util/request.js";

export default {
  data() {
    return {
      pageNum: 1, //页码
      pageSize: 50,  //页长
      total: 0,  //总表长
      NameOrStudentAccount:"",
      FieldworkForm:[],
      cascaderOptions: [],//所有班级
      selectedOptions: [],//选中班级数据
      selectedStatus: "0",
      selectedRow: [], // 选中行
    }
  },
  created() {
    this.getAllFieldwork()
  },
  methods:{
    getAllFieldwork(){
      let classNo = "1" //不可以删
      if (this.selectedOptions.at(2) !== undefined) {
        classNo = this.selectedOptions.at(2)
      }
      request.get("/related_fieldwork/getAllFieldwork?name=" + this.NameOrStudentAccount + "&accountNo=" + this.NameOrStudentAccount + "&pageNum=" + this.pageNum + "&pageSize=" + this.pageSize + "&classNo=" + classNo + "&state=" + this.selectedStatus).then(res => {
        if (res.data.code === '200') {
          for (let key in res.data.data) {
            if (key === "records") {
              this.FieldworkForm = res.data.data[key];
            } else if (key === "total") {
              this.total = res.data.data[key];
            }
          }
        }
      })
    },
    handleSizeChange(val) {
      this.pageSize = val;
      this.getAllFieldwork();
    },
    handleCurrentChange(val) {
      this.pageNum = val;
      this.getAllFieldwork();
    },
    // 选行
    handleSelectionChange(val) {
      this.selectedRow = val;
    },
    exportToExcel() {
      this.$nextTick(() => {
        // 获取 el-table 中的当前显示数据
        const tableData = this.selectedRow;
        // 确保数据存在
        if (tableData && tableData.length > 0) {
          // 提取所需的字段，并按照你想要的顺序和列名重组数据
          const formattedData = tableData.map(item => ({
            学号: item.accountNo,
            姓名: item.name,
            项目名称: item.projectName,
            项目职责: item.projectDuty,
            项目负责人: item.projectManage,
            开始时间: item.startTime,
            结束时间: item.endTime,
            备注: item.remark,
          }));

          // 将数据转换为 Excel 格式
          const worksheet = XLSX.utils.json_to_sheet(formattedData);
          const workbook = XLSX.utils.book_new();
          XLSX.utils.book_append_sheet(workbook, worksheet, 'Sheet1');

          // 下载 Excel 文件
          XLSX.writeFile(workbook, 'student_Fieldwork.xlsx');
        } else {
          // 提示用户没有数据可供导出
          alert('没有数据可供导出！');
        }
      });
    },
  }
}
</script>

<style scoped>

</style>
